<admintpl file="header" />
<style type="text/css">
.pic-list li {
    margin-bottom: 5px;
}

input,select{
    z-index: 100!important;
}
</style>
</head>
<body>
    <div class="wrap js-check-wrap">
        <ul class="nav nav-tabs">
            <li class="active"><a href="{:U('CardRecharge/recharge',array('id'=>empty($item['id'])?'':$item['id']))}" target="_self">卡片充值</a></li>
        </ul>
        <div id="mask"></div>
        <form action="{:U('CardRecharge/recharge_post')}" method="post" class="form-horizontal js-ajax-forms" onsubmit="return submitform();" enctype="multipart/form-data" onkeydown="if(event.keyCode==13){return false;}">
            <input type="hidden" name="force_price" id="force_price" value="">
            <div class="row-fluid">
                <div class="span9">
                    <table class="table table-bordered">
                        <tr>
                        <th>卡号</th>
                            <td>
                                <input type="text" name="card_number" class="require" id="card_number" value="" style="width: 400px" placeholder="请输入卡号">
                                <span class="desc hand_input">请使用读卡机</span>
                                <!-- <div class="div_quicksearch card_number_list">
                                    <input type="text" name="select_card_number" id="select_card_number" value="" placeholder="请输入会员卡号"/>
                                    <ul class="card_number_list quicksearch">
                                        <foreach name="card_list" item="citem">
                                            <li  onclick="quick_select('card_number','{$citem.number}')">{$citem.number}</li>
                                        </foreach>
                                        <li class="no_card_number">没找到数据</li>
                                    </ul>
                                </div> -->
                            </td>
                        </tr>
                        <tr>
                            <th>所属机构</th>
                            <td>
                                <input type="text" name="logistics_name" id="logistics_name" value="" style="width: 400px" readonly>
                            </td>
                        </tr>
                        <tr>
                            <th>卡内余额</th>
                            <td>
                                <input type="text" name="card_balance" id="card_balance" value="" style="width: 400px" readonly>
                            </td>
                        </tr>
                        <tr>
                            <th>会员姓名</th>
                            <td>
                                <input type="text" class="editable" name="vip_name" id="vip_name" value="" style="width: 400px" placeholder="请输入会员姓名" readonly>
                            </td>
                        </tr>
                        <tr>
                            <th>会员手机</th>
                            <td>
                                <input type="text" class="editable" name="vip_phone" id="vip_phone" value="" style="width: 400px" placeholder="请输入会员手机号" readonly>
                            </td>
                        </tr>
                        <tr>
                            <th>会员车牌</th>
                            <td>
                                <input type="text" class="editable" name="vip_plate_number" id="vip_plate_number" value="" style="width: 400px" placeholder="请输入充值汽车的车牌" readonly>
                            </td>
                        </tr>
                        <tr>
                            <th>充值金额</th>
                            <td>
                                <input type="text" class="require number" name="recharge_price" id="recharge_price" value="" style="width: 400px"  placeholder="请输入充值金额">
                            </td>
                        </tr>
                        <tr>
                            <th>赠送金额</th>
                            <td>
                                <input type="hidden"  name="give_percent" id="give_percent" value="{$sale.give_percent}">
                                <input type="text"  name="give_price" id="give_price" value="" style="width: 400px" readonly>
                            </td>
                        </tr>
                        <tr>
                            <th>充值描述</th>
                            <td>
                                <input type="text" class="" name="desc" id="desc" value="" style="width: 400px"  placeholder="请输入充值描述">
                            </td>
                        </tr>
                        
                    </table>
                </div>

            </div>
            <div class="form-actions">
                <button class="btn btn-primary js-ajax-submit" type="submit">确认付款</button>
            </div>
        </form>
    </div>
    <script type="text/javascript" src="__PUBLIC__/js/common.js"></script>
    <script type="text/javascript" src="__PUBLIC__/js/jquery.barcode.js"></script>
    <script type="text/javascript">
        var card_status = 1;
        $("#card_number").startListen({
            barcodeLen : 10,
            letter : false,
            number : true,
            check  : true,
            show : function(code){
                change_card_id();
            }
        });
        function submitform(){
            if(card_status != 1){
                return false;
            }
            var result = true;
            $(".require").each(function(){
                if($(this).val() == ''){
                    var title = $(this).parent().parent().find("th").remove("span").text().replace("*","");
                    alert("请填写"+title);
                    result = false;return false;
                }
            });
            if (!result) {
                return false;
            }
            var card_number = $('#card_number').val();
            var logistics_name = $('#logistics_name').val();
            var card_balance = $('#card_balance').val();
            var vip_name = $('#vip_name').val();
            var vip_phone = $('#vip_phone').val();
            var vip_plate_number = $('#vip_plate_number').val();
            var recharge_price = $('#recharge_price').val();
            var give_price = $('#give_price').val();

            if (!confirm("是否确认充值？\r\n卡号："+card_number+"\r\n充值金额："+recharge_price+"\r\n赠送金额："+give_price+"\r\n")) {
                return false;
            }

            return true;
        }
    </script>
    <script>

        $(document).ready(function () {
            
            $("#card_number").keypress(function (e) { //这里给function一个事件参数命名为e，叫event也行，随意的，e就是IE窗口发生的事件。
                var key = e.which; //e.which是按键的值
                if (key == 13) {
                    //change_card_id();
                }
            });
            if(card_status == 1){
                $("#sale_good_id").change(function(){
                    change_good_id();
                });
                $("#sale_good_id").trigger('change');
            }else{
                return false;
            }
            // $('.wrap:not(:input)').click(function(){
            //  console.log($(this));
            //  $('#card_number').select();
            //  event.stopPropagation();
            //  return false;
            // });
            $(document).delegate(".wrap", "click", function(e) {  
                    var ev = e || window.event; // 事件  
                    var target = ev.target || ev.srcElement; // 获得事件源
                    console.log($(target));
                    if ((target.tagName == 'INPUT' || target.tagName == 'SELECT') && target.readonly != true) {
                    }else{
                        $('#card_number').select();
                    }
                });  

        });

        var force_price = false;
        function change_card_id(){
            var card_number = $("#card_number").val();
            $.ajax({url:"{:U('Logistics/AdminCard/ajax_get_card')}",async:false,dataType:"json",data:"card_number="+card_number,type:"post",success:function(t){
                if(t.code == 1){
                    var temp = t.data;
                    card_status = temp.status;
                    if(temp.status != 1){
                        alert("该卡号已注销，无法消费!");

                    }else{
                        $("#card_balance").val(temp.balance);
                        $("#logistics_name").val(temp.logistics_name);
                        $("#vip_name").val(temp.vip_name);
                        $("#vip_phone").val(temp.vip_phone);
                        $("#vip_plate_number").val(temp.vip_plate_number);

                    }

                }else{
                    alert(t.data);
                }
                $('.editable').attr('readonly','readonly');
            }});
        }

        /*更换商品应付价格*/
        function change_recharge_price(){
            var recharge_price = $('#recharge_price').val();
            var give_percent = $('#give_percent').val();

            var give_price = give_percent * recharge_price / 100;


            $.ajax({url:"{:U('CardRecharge/get_rebate_price')}",async:false,dataType:"json",data:"recharge_price="+recharge_price,type:"post",success:function(t){
                if(t.code == 1){
                    $("#give_price").val((t.price+give_price).toFixed(2));
                }else{
                    alert(t.data);
                }
            }});


           // $('#give_price').val(give_price.toFixed(2));
        }

        $('#recharge_price').change(function(){
            change_recharge_price();
        });

        $('.editable').click(function(){
            $(this).removeAttr('readonly').select();
        });
        $('.editable').blur(function(){
            $(this).attr('readonly','readonly');
        });
    </script>
    <script type="text/javascript" src="__PUBLIC__/js/layer3/layer.js"></script>
    <link rel="stylesheet" type="text/css" href="__PUBLIC__/js/layer3/theme/default/layer.css">
    <script type="text/javascript">
        /*此为手动输入*/
        $('.hand_input').click(function(){
            layer.prompt({title: '请输入口令', formType: 1}, function(pass, index){
                if (pass == '24865') {
                    layer.close(index);
                    layer.prompt({title: '请填写卡号', formType: 3}, function(text, index){
                        layer.close(index);
                        $('#card_number').val(text);
                        change_card_id();
                    });
                }else{
                    layer.close(index);
                    layer.msg('口令错误');
                }
            });
        });
    </script>
    </body>
</html>